.archives-container {
    padding: 20px;
    border-radius: $common-border-radius;
    .archives-title {
        svg {
            width:1.5em;
            height:1.5em;
        }
        span {
            font-size: 18px;
            margin-left: 5px;
        }
    }
    .archives-main {
        margin: 10px 0;
        font-size: 16px;
        .archives-item {
            height: 40px;
            padding: 0 8px;
            @include border-radius(8px);
            transition: all .2s;
            cursor: pointer;
            .time {
                transform: translateX(0);
                transition: all .3s;
            }
            .count {
                height: 28px;
                width: 32px;
                background-color: $button-blue-color;
                color: $common-white-color;
                @include border-radius(4px);
            }
        }
        .archives-item:hover {
            background-color: $bg-overlay-color;
            .time {
                color:$button-blue-color;
                transform: translateX(10%);
            }
        }
    }
}
.archives-container:hover {
    box-shadow: $hover-card-shadow;
}